import React, { Component } from "react";
import store from '../../redux/store' ;
import {jiaAction, jianAction, asyncJiaAction} from '../../redux/actions/ZanActions'
import { addAction, minusAction } from "../../redux/actions/CollActions";

export default class Redux extends Component {
    render() {
        return (
            <div className="container">
                <h3>当前的点赞数: {store.getState().zan} </h3>
                <button onClick={this.add}>增加</button>
                <button onClick={this.minus}>减小</button>
                <button onClick={this.asyncAdd}>1秒后增加</button>
                <hr />
                <h3>当前的收藏数: {store.getState().coll}</h3>
                <button onClick={() => {
                    store.dispatch(addAction(10));
                }}>新增</button>
                <button onClick={() => {
                    store.dispatch(minusAction(5));
                }}>减少</button>
            </div>
        );
    }

    //增加
    add = () => {
        store.dispatch(jiaAction(10));
        console.log(store.getState());
    }

    //减小
    minus = () => {
        store.dispatch(jianAction(5));
        console.log(store.getState());
    }

    asyncAdd = () => {
        // setTimeout(() => {
        //     store.dispatch(jiaAction(1));
        // }, 1000)

        store.dispatch(asyncJiaAction(50))
    }
    
}
